<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!-- 头部 start -->
<header id="header">
    <div class="top_banner">
        <img src="images/top_banner.jpg" alt="">
    </div>
    <div class="shortcut">
        <!-- 未登录状态  -->
        <div class="login_out">
            <a href="login.html">登录</a>
            <a href="register.html">注册</a>
        </div>
        <!-- 登录状态  -->
        <div class="login">
            <span></span>
            <a href="myfavorite.html" class="collection">我的收藏</a>
            <a href="/userServlet?action=logout">退出</a>
        </div>
    </div>
    <div class="header_wrap">
        <div class="topbar">
            <div class="logo">
                <a href="/"><img src="images/logo.jpg" alt=""></a>
            </div>
            <div class="search">
                <input name="rname" id="rname" type="text" placeholder="请输入路线名称" class="search_input" autocomplete="off">
                <a href="javascript:searchRoute();" class="search-button">搜索</a>
            </div>
            <div class="hottel">
                <div class="hot_pic">
                    <img src="images/hot_tel.jpg" alt="">
                </div>
                <div class="hot_tel">
                    <p class="hot_time">客服热线(9:00-6:00)</p>
                    <p class="hot_num">400-618-9090</p>
                </div>
            </div>
        </div>
    </div>
</header>
<!-- 头部 end -->
<!-- 首页导航 -->
<div class="navitem">
    <ul class="nav">
        <li class="nav-active"><a href="index.html">首页</a></li>
        <li><a href="route_list.html">门票</a></li>
        <li><a href="route_list.html">酒店</a></li>
        <li><a href="route_list.html">香港车票</a></li>
        <li><a href="route_list.html">出境游</a></li>
        <li><a href="route_list.html">国内游</a></li>
        <li><a href="route_list.html">港澳游</a></li>
        <li><a href="route_list.html">抱团定制</a></li>
        <li><a href="route_list.html">全球自由行</a></li>
        <li><a href="favoriterank.html">收藏排行榜</a></li>
    </ul>
</div>
<script>
    // 在页面加载成功后,发送ajax请求,查询用户登录的状态
    $(function(){
        var url = "/userServlet";
        var params = {"action":"getLoginStatus"};
        // 发送ajax请求
        $.get(url,params,function(resultData){
            // 在页面上局部刷新
            if(resultData.flag){
                // 有用户登录,显示登录成功后的用户信息
                $(".login>span").html(`欢迎回来，${resultData.successData.username}`);
                $(".login_out").hide();
            }else{
                // 没有用户登录
                $(".login").hide();
            }
        },"json");
    });
</script>
</body>
</html>